<template>
    <div id="upload" >
        <el-dialog title="发布新资源" width="500px" center :visible.sync="isUpload">
            <el-form
                    :model="ResourseItem"
                    :rules="rules"
                    status-icon
                    ref="ruleForm"
                    class="demo-ruleForm"
            >
                <el-form-item prop="title">
                    <el-input
                            prefix-icon="el-icon-document"
                            placeholder="请输入资源标题"
                            v-model="ResourseItem.title"
                    ></el-input>
                </el-form-item>
                <el-form-item prop="name">
                    <el-input
                            prefix-icon="el-icon-goods"
                            placeholder="请输入资源名称"
                            v-model="ResourseItem.name"
                    ></el-input>
                </el-form-item>
                <el-form-item prop="kind">
                    <el-input
                            prefix-icon="el-icon-star-off"
                            placeholder="请输入资源分类：场馆预订/物品出租/人力资源出租"
                            v-model="ResourseItem.kind"
                    ></el-input>
                </el-form-item>
                <el-form-item prop="intro">
                    <el-input
                            prefix-icon="el-icon-news"
                            placeholder="请输入资源简介"
                            v-model="ResourseItem.intro"
                    ></el-input>
                </el-form-item>
                <el-form-item prop="image">
                    <el-input
                            prefix-icon="el-icon-picture"
                            placeholder="请上传资源照片"
                            v-model="ResourseItem.image"
                    ></el-input>
                </el-form-item>
                <el-form-item prop="number">
                    <el-input
                            prefix-icon="el-icon-more"
                            placeholder="请输入资源数量"
                            v-model="ResourseItem.number"
                    ></el-input>
                </el-form-item>
                <el-form-item prop="price">
                    <el-input
                            prefix-icon="el-icon-check"
                            placeholder="请输入资源单价"
                            v-model="ResourseItem.price"
                    ></el-input>
                </el-form-item>
                <el-form-item prop="start_time">
                    <el-input
                            prefix-icon="el-icon-bell"
                            placeholder="请输入起始时间"
                            v-model="ResourseItem.startTime"
                    ></el-input>
                </el-form-item>
                <el-form-item prop="finish_time">
                    <el-input
                            prefix-icon="el-icon-date"
                            placeholder="请输入结束时间"
                            v-model="ResourseItem.endTime"
                    ></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button size="medium" type="primary" @click="Upload" style="width:100%;">上传</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>
    </div>
</template>
<script>
    export default {
        name: "MyUpload",
        props: ["upload"],
        data(){
            return{
                isUpload:false,
                ResourseItem:{
                    title: "",
                    name: "",
                    kind: "",
                    intro: "",
                    image: "",
                    number: "",
                    price: "",
                    startTime: "",
                    endTime: ""
                }
            }
        },
        watch: {
            // 监听父组件传过来的upload变量，设置this.isUpload的值
            upload: function(val) {
                if (val) {
                    this.isUpload = val;
                }
            },
            // 监听this.isUpload变量的值，更新父组件upload变量的值
            isUpload: function(val) {
                if (!val) {
                    this.$refs["ruleForm"].resetFields();
                    this.$emit("fromChild", val);
                }
            }
        },
        methods:{
            Upload(){
                this.$axios
                    .post("/api/product/addResource", {
                        products_title: this.ResourseItem.title,
                        products_name: this.ResourseItem.name,
                        category: this.ResourseItem.kind,
                        product_intro: this.ResourseItem.intro,
                        product_picture: this.ResourseItem.image,
                        product_num: this.ResourseItem.number,
                        product_price: this.ResourseItem.price,
                        start_time: this.ResourseItem.startTime,
                        end_time: this.ResourseItem.endTime,
                        user_id: this.$store.getters.getUser.user_id
                    })
                    .then(res => {
                        // “001”代表插入成功，其他的均为失败
                        if (res.data.code === "001") {
                            // 隐藏上传组件
                            this.isUpload = false;
                            this.notifySucceed(res.data.msg);
                        } else {
                            // 弹出通知框提示登录失败信息
                            this.notifyError(res.data.msg);
                        }
                    })
                    .catch(err => {
                        return Promise.reject(err);
                    });
            }
        }
    };
</script>